<div class="content padded">
	
    <div class="row">
    
    	<div class="col-lg-6">
        
        	<!-- Top Bar -->
            <div class="top-bar">
            	<span class="pull-left"><a href="#" class="ajax-project-close btn btn-default btn-sm btn-pull-up"><i class="fa fa-times icon-before"></i>Cerrar</a></span>
                <h6 class="pull-right text-muted short">Detalles del Proyecto</h6>
            </div>
  
  			<div class="long">
                <h2 class="short">{{ entity.nombre }}</h2>
                <span class="text-muted">{{ entity.categoria }}</span>
            </div>
            
            <div class="row">
            
            	<div class="col-lg-6">
                	<h5>Informacion General</h5>
                    <p>{{ entity.info | raw |  nl2br }} </p>
                </div>
                
                <div class="col-lg-6">
                	<h5>Particularidades del Proyecto</h5>
                    <p>{{ entity.detalles | raw |  nl2br }}</p>
                </div>
                
                <div class="col-lg-12">
                	<h5>Resultados</h5>
                    <p>{{ entity.resultado | raw |  nl2br }} </p>
                    
                </div>
            
            </div>
        
        </div>
        
        <div class="col-lg-6">
        
          <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
          
            <!-- Indicators -->
            <ol class="carousel-indicators">
              <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
              <li data-target="#carousel-example-generic" data-slide-to="1"></li>
              <li data-target="#carousel-example-generic" data-slide-to="2"></li>
            </ol>
          
            <!-- Wrapper for slides -->
            <div class="carousel-inner">
                {% for i in 1..entity.cantidadImagenes %}
              <div class="item {% if i==1 %}active{% endif %}"> 
                 <img src="{{ asset('template/images/portfolio/' ~ entity.slug ~ i ~'.png') }}" alt="" />
              </div>
                {% endfor %}
              
            </div>
          
            <!-- Controls -->
            <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
              <span class="glyphicon glyphicon-chevron-left"></span>
            </a>
            <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
              <span class="glyphicon glyphicon-chevron-right"></span>
            </a>
            
          </div>
        
        </div>
        
    </div>
    
</div>

<!-- Scripts -->
<script>
$(document).ready(function (){
	
  // Ajax Project Close	
	
  function closeContent() {
	  $('.project-content').delay(100).slideUp(1000,function() { $('.project-loader').show(0); $('.project-loader .logo-loader').show(0); $.waypoints('refresh') });
	  $('html, body').animate({scrollTop:$('#portfolio').position().top },600); 
  }
	
  $('.ajax-project-close').click(function() {
	  closeContent();
  });
  
});
</script>
